<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>管理员列表-WeAdmin Frame型后台管理系统-WeAdmin 1.0</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<link rel="stylesheet" href="../../static/css/font.css">
		<link rel="stylesheet" href="../../static/css/weadmin.css">
		<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
		<!--[if lt IE 9]>
	      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
	      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
	    <![endif]-->
	</head>

	<body>
		<div class="weadmin-nav">
			<span class="layui-breadcrumb">
        <a href="">首页</a>
        <a href="">管理员管理</a>
        <a>
          <cite>管理员列表</cite></a>
      </span>
			<a class="layui-btn layui-btn-sm" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
				<i class="layui-icon" style="line-height:30px">ဂ</i></a>
		</div>
		<div class="weadmin-body">
			<div class="layui-row">
				<form class="layui-form layui-col-md12 we-search">
					<div class="layui-inline">
						<input class="layui-input" placeholder="开始日" name="start" id="start">
					</div>
					<div class="layui-inline">
						<input class="layui-input" placeholder="截止日" name="end" id="end">
					</div>
					<div class="layui-inline">
						<input type="text"  id="username" name="username" lay-verify="username"  placeholder="操作员姓名" autocomplete="off" class="layui-input">
					</div>
					<button class="layui-btn" lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
				</form>
			</div>
			<div class="weadmin-block">
				<button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
				<button class="layui-btn" onclick="WeAdminShow('添加用户','./add.html')"><i class="layui-icon"></i>添加</button>
				<span class="fr" style="line-height:40px">共有数据：88 条</span>
			</div>
			
			<!-- 数据表格 -->
				<table class="layui-hide" id="mytable" lay-filter="mytable"></table>
			<table class="layui-table">
				<thead>
					<tr>
						<th>
							<div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
						</th>
						<th>ID</th>
						<th>登录名</th>
						<th>手机</th>
						<th>邮箱</th>
						<th>角色</th>
						<th>加入时间</th>
						<th>状态</th>
						<th>操作</th>
				</thead>
				<tbody>
					<tr>
						<td>
							<div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='2'><i class="layui-icon">&#xe605;</i></div>
						</td>
						<td>1</td>
						<td>admin</td>
						<td>18925139194</td>
						<td>113664000@qq.com</td>
						<td>超级管理员</td>
						<td>2017-01-01 11:11:42</td>
						<td class="td-status">
							<span class="layui-btn layui-btn-normal layui-btn-xs">已启用</span></td>
						<td class="td-manage">
							<a onclick="member_stop(this,'10001')" href="javascript:;" title="启用">
								<i class="layui-icon">&#xe601;</i>
							</a>
							<a title="编辑" onclick="WeAdminShow('编辑','./edit.html')" href="javascript:;">
								<i class="layui-icon">&#xe642;</i>
							</a>
							<a title="删除" onclick="member_del(this,'要删除的id')" href="javascript:;">
								<i class="layui-icon">&#xe640;</i>
							</a>
						</td>
					</tr>
				</tbody>
			</table>
			<div class="page">
				<div>
					<a class="prev" href="">&lt;&lt;</a>
					<a class="num" href="">1</a>
					<span class="current">2</span>
					<a class="num" href="">3</a>
					<a class="num" href="">489</a>
					<a class="next" href="">&gt;&gt;</a>
				</div>
			</div>
		</div>
		<!-- 表格头部工具栏 -->
	<script type="text/html" id="toolbar">
  		<div class="layui-btn-container">
			<button class="layui-btn layui-btn-normal layui-btn-sm" lay-event="addOperator">新增操作员</button>
  		</div>
	</script>
	<!-- 操作栏 -->
	<script type="text/html" id="operateBar">
  		<a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="operator_detail">查看信息</a>
  		<a class="layui-btn layui-btn-xs" lay-event="update_role">变更角色</a>
	</script>
		<script src="../../lib/layui/layui.js" charset="utf-8"></script>
		<script src="../../static/js/jquery-1.12.1.min.js" charset="utf-8"></script>
    	<script src="../../static/js/eleDel.js" type="text/javascript" charset="utf-8"></script>
    	
    	<script>
    	layui.use('table', function() {
    		var table = layui.table;
			table.render({
				elem : '#mytable',
				url : 'http://localhost:8080/layuiWebModel/operator/operatorMultQuery.do',
				even:true,//重点1：这里的sort表示 table表在取得接口数据后，对页面渲染后的table数据进行排序。同时，这里的true 会影响页面sort 上下小箭头的 显示效果
				method : 'post',
				contentType : 'application/json',
				response : {
					statusCode : '0000' //规定成功的状态码，默认：0
				},
				cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
				toolbar: '#toolbar',	//头部工具栏
				page : {
					theme: '#1E9FFF'
				},
				where : {
					'userId':$('#userId').val(),
				    'state':$('#state').val()
				},
				cols : [[
				{
					field : 'createTime',
					title : '创建时间',
					hide  : true,
				},
				{
					field : 'userId',
					title : '操作员ID'
				}, {
					field : 'account',
					title : '操作员登录号'
				}, {
					field : 'username',
					title : '操作员姓名'
				}, {
					field : 'state',
					title : '操作员状态',
					templet: function(d){
						if(d.state == 'ENABLE'){
							return '<span style="color: #5FB878;">启用</span>';
						}
						else{
							return '<span style="color: #FF5722;">禁用</span>';
						}
				    }
				},
				{
					field : 'operate',
					title : '操作',
					toolbar:'#operateBar',
					width:200
				}]]
			});
			
			//头工具栏事件
			table.on('toolbar(mytable)', function(obj){
				layer.msg("mytable",{icon: 5});
				  var data = obj.data;
		/* 	  var checkStatus = table.checkStatus(obj.config.id); */
			  switch(obj.event){
			  	case 'addRole':
			  		/* window.location.href = "${ctx.contextPath}/operator/addRole.html"; */
			  		layer.msg("addRole",{icon: 5});
			  	break;
			    case 'addOperator':
			    	layer.msg("addOperator",{icon: 5});
			    	/* window.location.href = "${ctx.contextPath}/operator/operatorAdd.html"; */
			    
			  };
			});
			
			//监听行工具事件
			table.on('tool(mytable)', function(obj){
			  var data = obj.data;
			  switch(obj.event){
			    case 'operator_detail':
			    	var t=new Date().getTime();
			    	layer.msg("operator_detail",{icon: 5});
			    	window.location.href = "./role-add.html";
			    	/* window.location.href = "${ctx.contextPath}/operator/operatorSingleQuery.html?userId="+data.userId; */
			    break;
			    case 'update_role':
			    	var t=new Date().getTime();
			    	layer.msg("update_role",{icon: 5});
			    	/* window.location.href = "${ctx.contextPath}/operator/operatorRoleUpdate.html?userId="+data.userId+"&t="+t; */
			    break;
			    case 'addOperator':
			    	layer.msg("addOperator2",{icon: 5});
			    	break;	
			  };
			});
			
			$('#search').on('click', function(event) {
				event.preventDefault();
				table.reload('mytable',{
				  where: { //设定异步数据接口的额外参数，任意设
					  	'userId':$('#userId').val(),
					    'username':$('#username').val()
					  }
				  ,page: {
				    curr: 1 //重新从第 1 页开始
				  }
				});
			});
    	});
    	</script>
    	
	</body>

</html>